.settings h1 {
    color: #1A2933;
  }
  
.btn {
cursor: pointer;
margin: 5px;
padding: 10px;
font-size: 1.25rem;
border-radius: 10px;
color: #fff;
background-color: #0069d9;
white-space: nowrap;
border: 1px solid transparent;
padding: .375rem .75rem;
font-size: 1rem;
line-height: 1.5;
border-radius: .25rem;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn:hover {
color: #fff;
background-color: #0b4165;
border-color: #0b4165;
}

.settings-watermark {
padding-bottom: 5px;
padding-left: 60px;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
color: #818181;
text-align: center;
}

.settings {
  background-color: #f1f1f1;
  text-align: center;
  height: 100%;
  padding-top: 45px;
}

.watermark-link {
color: #919191;
text-decoration: none;
font-weight: 500
}

.setup {
padding-top: 32px;
height: 100%;
background-color: #1a2933;
text-align: center;
height: 100%;
padding-top: 45px;
border: 1px transparent; 
}

.setup h1 {
margin-top: 32px;
color: #f1f1f1;
animation: fadein 1.5s cubic-bezier(.57,.6,.58,.87);
}

.setup p {

color: #A1A1A1;
padding-left: 20%;
padding-right: 20%;
text-align: center;
animation: fadein 1.7s cubic-bezier(.57,.6,.58,.87);
}

.setup-row::after {
box-sizing: border-box;
content: "";
clear: both;
display: table;
padding-left: 15%;
padding-right: 15%;
}

[class*="col-"] {
float: left;
padding: 15px;
padding-bottom: 30px;
}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

/* ANIMS */

@keyframes fadein {
from { opacity: 0; }
to   { opacity: 1; }
}

@keyframes fadeout {
from { opacity: 1; }
to   { opacity: 0; }
}

.fade-in {
animation: fadein 1s;
}

.fade-out {
animation: fadeout 1s;
}

@keyframes fadeinsetup {
from { opacity: 0; transform: translateY(20px); }
to   { opacity: 1; transform: translateY(0px);}
}

.fade-in-setup {
animation: fadeinsetup 1s;
}

.setup-icon {
font-size: 48px;
color: #f1f1f1;
}

/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}

/* The slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}

.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}

input:checked + .slider {
background-color: #2196F3;
}

input:focus + .slider {
box-shadow: 0 0 1px #0066FF;
}

input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
border-radius: 34px;
}

.slider.round:before {
border-radius: 50%;
}

.switch-social {
    margin-top: 10px;
}

.settings-icon {
  font-size: 3rem;
  color: #1A2933;
  text-align: center;
}